<script>

  $(function() {
	  $('#step-2').hide();
	  $('#step-3').hide();
	  var progressbar = $( "#progressbar" ),
	  progressLabel = $( ".progress-label" );
	  var number = $('#completedSteps');
      progressbar.progressbar({
        value: 0,
        max: 3,
        change: function() {
            //progressLabel.text( "Completed " + progressbar.progressbar( "value" ) + " of 3 steps" );
            number.text(progressbar.progressbar( "value" ));
        }
      });
  });
  function nextStep(step) {
  	  $('#step-1').hide();
  	  $('#step-2').hide();
  	  $('#step-3').hide();
  	  $('#step-' + step).show();
  	  $( "#progressbar" ).progressbar( "value", (step - 1) );
    }
  </script>
<h1>{$lang['signup']}</h1>
<p>
	<div id="progressbar"><div class="progress-label">{$lang['doneSteps1']} <span id="completedSteps">0</span> {$lang['doneSteps2']}</div></div>
</p>
<form action="{$smarty.const.WEBROOT}/?action=registerAccount" method="POST"
	id="registerAccount">
<div id="step-1">
<h3>{$lang['accountInfo']}</h3>
	<table class="regTbl" cellspacing="0">
		<tr><td>{$lang['username']}:</td><td><input type="text" class="feedbackInput inputHeight inputWidth" id="name" name="name"/></td></tr>
		<tr><td>{$lang['password']}:</td><td><input type="password" class="feedbackInput inputHeight inputWidth" id="password" name="password"/></td></tr>
		<tr><td>{$lang['r_password']}:</td><td><input type="password" class="feedbackInput inputHeight inputWidth" id="r_password" name="r_password"/></td></tr>
		<tr><td>{$lang['givenName']}:</td><td><input type="text" class="feedbackInput inputHeight inputWidth" id="givenname" name="givenname"/></td></tr>
		<tr><td>{$lang['email']}:</td><td><input type="text" class="feedbackInput inputHeight inputWidth" id="email" name="email"/></td></tr>
		<tr><td>{$lang['phone']}:</td><td><input type="text" class="feedbackInput inputHeight inputWidth" id="phone" name="phone"/></td></tr>
		<!-- <tr><td colspan="2"><input type="checkbox"/> Agree to the <a href="#">terms of service</a></td></tr>  -->
	</table>
	<div class="clearfix"></div>
	<br>
	<p class="readmore">
		<a href="#" onclick="nextStep(2)">{$lang['next']}</a> »
	</p>
</div>

<div id="step-2">
<h3>{$lang['businessInfo']}</h3>
	<table class="regTbl" cellspacing="0">
		<tr><td>{$lang['companyName']}:</td><td><input type="text" class="feedbackInput inputHeight inputWidth" id="businessname" name="businessname"/></td></tr>
		<tr><td>{$lang['category']}:</td><td>{html_options name=category options=$cats class="feedbackInput inputHeight inputWidth"}</td></tr>
		<tr><td>{$lang['description']}:</td><td><textarea class="feedbackInput textareaHeight inputWidth" id="description" name="description"> </textarea></td></tr>
		<tr><td>{$lang['address']}:</td><td><input type="text" class="feedbackInput inputHeight inputWidth" id="address" name="address"/></td></tr>
		<tr><td>{$lang['phone']}:</td><td><input type="text" class="feedbackInput inputHeight inputWidth" id="phone" name="phone"/></td></tr>
		<tr><td>{$lang['website']}:</td><td><input type="text" class="feedbackInput inputHeight inputWidth" id="website" name="website"/></td></tr>
		<!-- <tr><td>Image:</td><td><input type="text" class="feedbackInput inputHeight inputWidth" id="imgurl" name="imgurl"/></td></tr> -->
		<tr><td colspan="2"><input type="checkbox" id="notify" name="notify"/> {$lang['feedbackNotify']}</td></tr>
	</table>
	<div class="clearfix"></div>
	<br>
	<p class="readmore">
		<a href="#" onclick="nextStep(3)">{$lang['next']}</a> »
	</p>
</div>

<div id="step-3">
<h3>{$lang['contractInfo']}</h3>
<p>{$lang['contractDescription']}</p>
		<!--
	<table class="regTbl" cellspacing="0">
		<tr><td>Billing name:</td><td><input type="text" class="feedbackInput inputHeight inputWidth" id="billingName" name="billingName"/></td></tr>
		<tr><td>Billing address:</td><td><input type="text" class="feedbackInput inputHeight inputWidth" id="billingAddress" name="billingAddress"/></td></tr> 
	</table>-->
</form>
	<div class="clearfix"></div>
	<br>
	<p class="readmore">
		<a href="#" onclick="register($('#registerAccount'))">{$lang['confirm']}</a> »
	</p>
</div>